<script>
import outMain from "@/components/outMain.vue";
import { sjkjck, indexData } from "@/http/api";
export default {
  components: { outMain },
  name: "",
  data() {
    return {
      tableData: [],
      formData: {
        accumulate_tj: {
          gt: "-  -",
          jl: "-  -",
          jy: "-  -",
          lz: "-  -",
        },
        month_tj: {
          gt: "-  -",
          jl: "-  -",
          jy: "-  -",
          lz: "-  -",
        },
        today_tj: {
          gt: "-  -",
          jl: "-  -",
          jy: "-  -",
          lz: "-  -",
        },
        msz: "- -",
      },
      queryData: {
        search: "",
        page: 1,
        per_page: 20,
      },
      total: 0,
    };
  },
  props: {},
  setup() {},
  methods: {
    linkFn(url, id, navId) {
      if (id != 0) {
        this.$router.push({ path: url, query: { id: id, navId: navId } });
      }
    },
    async getData() {
      const { data } = await sjkjck(this.queryData);
      if (data.code == 1) {
        this.tableData = data.data.data;
        this.total = data.data.total;
      }
    },
    async getTopData() {
      const { data } = await indexData(this.queryData);
      if (data.code == 1) {
        this.formData = data.data;
      }
    },
  },
  mounted() {},
  created() {
    this.getTopData();
    this.getData();
  },
};
</script>
<template>
  <outMain>
    <div class="cardCont">
      <div class="cardItem" @click="linkFn('/bootSign')">
        <div class="cardhead">
          <div class="cardTitle">签约船员</div>
          <div class="iconfont icon-yiqianyue_yiqianyue cardColor6"></div>
        </div>
        <div class="cardUnder">
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.today_tj.jy }}</div>
            <div class="cardName">今日</div>
          </div>
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.month_tj.jy }}</div>
            <div class="cardName">本月</div>
          </div>
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.accumulate_tj.jy }}</div>
            <div class="cardName">累计</div>
          </div>
        </div>
      </div>
      <div class="cardItem" @click="linkFn('/bootLeave')">
        <div class="cardhead">
          <div class="cardTitle">离职船员</div>
          <div class="iconfont icon-lizhi cardColor2"></div>
        </div>
        <div class="cardUnder">
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.today_tj.lz }}</div>
            <div class="cardName">今日</div>
          </div>
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.month_tj.lz }}</div>
            <div class="cardName">本月</div>
          </div>
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.accumulate_tj.lz }}</div>
            <div class="cardName">累计</div>
          </div>
        </div>
      </div>
      <div class="cardItem" @click="linkFn('/salaTalk')">
        <div class="cardhead">
          <div class="cardTitle">沟通船员</div>
          <div class="iconfont icon-goutong cardColor4"></div>
        </div>
        <div class="cardUnder">
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.today_tj.gt }}</div>
            <div class="cardName">今日</div>
          </div>
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.month_tj.gt }}</div>
            <div class="cardName">本月</div>
          </div>
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.accumulate_tj.gt }}</div>
            <div class="cardName">累计</div>
          </div>
        </div>
      </div>
      <div class="cardItem" @click="linkFn('/salaSelf')">
        <div class="cardhead">
          <div class="cardTitle">简历录入</div>
          <div class="iconfont icon-jianli1"></div>
        </div>
        <div class="cardUnder">
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.today_tj.jy }}</div>
            <div class="cardName">今日</div>
          </div>
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.month_tj.jy }}</div>
            <div class="cardName">本月</div>
          </div>
          <div class="cardUnderItem">
            <div class="cardNum">{{ formData.accumulate_tj.jy }}</div>
            <div class="cardName">累计</div>
          </div>
        </div>
      </div>
      <div class="cardItem" @click="linkFn('/bootInvite')">
        <div class="cardhead">
          <div class="cardTitle">面试中</div>
          <div class="iconfont icon-jinhangzhong1 cardColor3"></div>
        </div>
        <div class="cardUnder">
          <div class="cardUnderItem">
            <div class="cardNum linkText">{{ formData.msz }}</div>
            <div class="cardName">待处理</div>
          </div>
        </div>
      </div>
    </div>
    <div class="homeMain cardCont noPadding">
      <div class="homeLeft">
        <div class="tableCont textCenter">
          <div class="tableName flexCont">
            <div>数据快捷查看</div>
          </div>
          <el-table
            class="tableMain"
            :data="tableData"
            stripe
            style="width: 100%"
          >
            <el-table-column
              show-overflow-tooltip
              prop="enterprise_name"
              label="船东公司"
            >
              <template #default="{ row }">
                <span
                  :class="row.c_enterprise_id == 0 ? '' : 'linkText_'"
                  @click="
                    linkFn('/cooperationBooterDetail', row.c_enterprise_id)
                  "
                >
                  {{ row.enterprise_name }}
                </span>
              </template>
            </el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="position_name"
              label="岗位职务"
            >
              <template #default="{ row }">
                <div
                  class="linkText_"
                  @click="
                    linkFn('/workListDetail', row.enterprise_position_id, 1)
                  "
                >
                  {{ row.position_name }}
                </div>
              </template>
            </el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="hygk"
              label="换员港口"
            />
            <el-table-column prop="association_position_sum" label="备选船员">
              <template #default="{ row }">
                <div
                  class="linkText_"
                  @click="
                    linkFn('/workListDetail', row.enterprise_position_id, 5)
                  "
                >
                  {{ row.association_position_sum }}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="interview_sum" label="面试">
              <template #default="{ row }">
                <div
                  class="linkText_"
                  @click="
                    linkFn('/workListDetail', row.enterprise_position_id, 3)
                  "
                >
                  {{ row.interview_sum }}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="sign_sum" label="签约">
              <template #default="{ row }">
                <div
                  class="linkText_"
                  @click="
                    linkFn('/workListDetail', row.enterprise_position_id, 4)
                  "
                >
                  {{ row.sign_sum }}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="create_time" label="创建时间" />
          </el-table>
          <div class="pageCont">
            <el-pagination
              v-model:currentPage="queryData.page"
              v-model:page-size="queryData.per_page"
              background
              layout="total, prev, pager, next, jumper"
              :total="total"
              @size-change="getData"
              @current-change="getData"
            />
          </div>
        </div>
      </div>
    </div>
  </outMain>
</template>
<style scoped lang="less"></style>
